<template>
    <div class="comp-receive-reward">
        <modal :show="true" :width="400">
            <!--<template v-if="!hasRequested">-->
                <validator :rules="rules" :parent="_self">
                    <form class="m-form-dialog" name="form" action="javascript:;">
                        <div class="modal-header">
                            <a href="javascript:;" class="close" @click="hide"><span>×</span></a>
                            <span class="modal-title">
                                {{$tc('basic.securitySetting.receive.title',1)}}
                                {{coin}}
                                {{$tc('basic.securitySetting.receive.title',2)}}
                            </span>
                        </div>







                        <!--<div class="modal-body">-->
                            <!--<div class="col-row">-->
                                <!--<div class="col-input">-->
                                    <!--<input type="password"-->
                                           <!--class="fn-block"-->
                                           <!--autocomplete="off"-->
                                           <!--disableautocomplete-->
                                           <!--ref="input"-->
                                           <!--id="payPwd"-->
                                           <!--name="paypwd"-->
                                           <!--:placeholder="$t('common.assetPassRequireTip')"-->
                                           <!--v-model="form.paypwd">-->
                                    <!--<div class="ui-tip"></div>-->
                                <!--</div>-->
                                <!--<div class="btn-group">-->
                                    <!--<button type="submit"-->
                                            <!--class="ui-btn binds"-->
                                            <!--v-if="isRequesting === false"-->
                                            <!--@click="submit()">{{$t('common.confirm')}}</button>-->
                                    <!--<button type="submit"-->
                                            <!--class="ui-btn"-->
                                            <!--disabled-->
                                            <!--v-if="isRequesting === true">{{$t('common.waiting')}}...</button>-->
                                <!--</div>-->
                            <!--</div>-->
                        <!--</div>-->






                        <div class="modal-body">
                            <div class="col-row">
                                <!--<div class="col-label">-->
                                    <!--<label for="redeemCode">{{$t('basic.securitySetting.receive.lable')}}</label>-->
                                <!--</div>-->
                                <div class="col-input">
                                    <!--col-input&#45;&#45;block-->
                                    <input type="text"
                                           class="fn-block"
                                           id="redeemCode"
                                           name="redeemCode"
                                           autocomplete="off"
                                           :placeholder="$t('basic.securitySetting.receive.reqTip')"
                                           v-model="form.redeemCode">
                                    <div class="ui-tip"></div>
                                </div>

                                <div class="btn-group">
                                    <button type="submit"
                                            class="ui-btn binds"
                                            v-if="isRequesting === false"
                                            @click="submit()">{{ $t('common.confirm') }}</button>
                                    <button type="submit"
                                            class="ui-btn"
                                            disabled
                                            v-if="isRequesting === true">{{ $t('common.waiting') }}...
                                    </button>
                                </div>
                            </div>
                        </div>
                        <!--<div class="modal-footer">-->
                            <!--<div class="col-row">-->
                                <!--<div class="col-label">-->
                                    <!--<label></label>-->
                                <!--</div>-->
                                <!--<div class="col-text">-->
                                    <!--<div class="btn-group">-->
                                        <!--<button type="submit"-->
                                                <!--class="ui-btn binds"-->
                                                <!--v-if="isRequesting === false"-->
                                                <!--@click="submit()">{{ $t('common.confirm') }}</button>-->
                                        <!--<button type="submit"-->
                                                <!--class="ui-btn"-->
                                                <!--disabled-->
                                                <!--v-if="isRequesting === true">{{ $t('common.waiting') }}...-->
                                        <!--</button>-->
                                        <!--<a href="javascript:;"-->
                                           <!--class="btn-cancel"-->
                                           <!--@click="hide">{{ $t('common.cancel') }}</a>-->
                                    <!--</div>-->
                                <!--</div>-->
                            <!--</div>-->
                        <!--</div>-->
                    </form>
                </validator>
            <!--</template>-->
            <!--<template v-if="hasRequested">-->


            <!--</template>-->


        </modal>
    </div>
</template>

<script type="text/babel">

    import Vue from "vue";
    import Modal from "../../../../grsc-base/component/Modal.vue";
    import Validator from "../../../../grsc-base/component/Validator/main";
    import service from "../asset/service"

    export  default Vue.extend({
        data(){
            return {
                form: {
                    redeemCode: ''
                },
                rules: {
                    redeemCode: {
                        tip:'',
                        required: true,
                        requiredTip: this.$t('basic.securitySetting.receive.reqTip')
                    }
                },
                isRequesting:false,
                hasRequested:false
            }
        },
        props: {
            onHide: {
                type: Function,
                default(){
                }
            },
            onSuccess: {
                type: Function,
                default(){
                }
            },
            coin:{
                type:String
            }
        },
        computed: {},
        components: {
            'modal': Modal,
            Validator
        },
        created() {

        },
        methods: {

            submit(){

                if(this.rules.$checkAll()===false){
                    return;
                }

                this.isRegisting = true;
                let param = {
                    assetCode:this.coin,
                    redeemCode:this.form.redeemCode
                };
                service.receive(param).done(rep=>{
                    if(rep.code === window.CODE.SUCCESS){
                        window.success(this.$t('common.success'));
                        this.onSuccess();
                    }else{
                        window.error(rep.msg);
                    }
                }).always(()=>{
//                    this.hasRequested = true;
                    this.isRegisting = false;
                })
            },

            hide(){
                this.$emit('hide');
            }
        }
    })
</script>

<style lang="sass" rel="stylesheet/scss">
    .comp-receive-reward{
        .content{
            padding: 0 32px;
        }
    }
</style>